<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>

    <style>
        div{
            width: 1000px;
            height: 700px;
            border: 1px solid red;
            background-image: url("../image/pic.png");/*默认是全部平铺的*/
        }

        .div1{
            /*水平平铺*/
            background-repeat: repeat-x;
        }

        .div2{
            /*竖直平铺*/
            background-repeat: repeat-y;
        }

        .div3{
            /*垂直平铺*/
            background-repeat: no-repeat;
        }

        /*背景渐变*/
        /*渐变分为两种：径向渐变、圆形渐变*/
        body{
            background-color: #FAACA8;
            background-image: linear-gradient(19deg, #FAACA8 0%, #DDD6F3 100%);

        }

    </style>

</head>
<body>

<div class="div1">

</div>

<div class="div2">

</div>

<div class="div3">

</div>

</body>
</html>